import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15

Button {
    id: root
    implicitWidth: 200
    implicitHeight: 44
    checkable: true
    clip: true

    contentItem: Item {}

    background: Rectangle {
        color: root.checked ? '#0962EA' : (root.hovered ? '#528FEA' : 'transparent')
        radius: height / 2

        Rectangle {
            x: 0
            y: 0
            width: root.width / 2
            height: root.height
            color: parent.color
        }

        RowLayout {
            anchors.fill: parent
            anchors.leftMargin: 30
            spacing: 23

            Image {
                Layout.preferredWidth: 20
                Layout.preferredHeight: 20
                Layout.alignment: Qt.AlignVCenter
                source: icon.source
            }

            Text {
                Layout.alignment: Qt.AlignVCenter
                text: root.text
                color: 'white'
                font.pixelSize: 16
            }

            Item {
                Layout.fillWidth: true
            }
        }
    }
}

